<!--
基本信息--使用elelmentuiplus
-->

<template>
  <div>

    <div>
      <t-table
       v-loading="loading"
       element-loading-text="数据保存中.."
    element-loading-spinner="el-icon-loading"
    element-loading-background="rgba(0, 0, 0, 0.8)"
          :title="title"
          :table="state.table"
          :columns="state.table.columns"
          :isShowPagination="false"
          ref="singleEdit"
          :listTypeInfo="state.listTypeInfo"
          @handleEvent="handleEvent"
          @validateError="validateError"
      >
        <template #toolbar>
          <el-button type="primary" @click="addOneTable" v-if="!isBg" :disabled="!isShowSubBut">新增一行</el-button>
          <el-button type="primary" @click="savefile" v-if="!isBg" :disabled="!isShowSubBut">保存</el-button>
        </template>
        <template #FileName="{ scope }">
          <el-input :disabled="isBg" v-model="scope.row[scope.column.property]" placeholder="请输入文件名称"></el-input>
        </template>
        <template #uploadFile1="{ scope }">
          <upload :limit="1" :disabled="isBg || !isShowSubBut" v-model="scope.row[scope.column.property]"></upload>
        </template>
        <template #uploadFile2="{ scope }">
          <upload :limit="1"  :disabled="isBg || !isShowSubBut" v-model="scope.row[scope.column.property]"></upload>
        </template>
        <template #uploadFile3="{ scope }">
          <upload :limit="1" :disabled="isBg || !isShowSubBut" v-model="scope.row[scope.column.property]"></upload>
        </template>
      </t-table>
    </div>

  </div>
</template>

<script setup>
import {onMounted, ref, toRefs, watch,onUpdated,onActivated,onDeactivated} from "vue";
import {cubasdocStore} from "@/stores/modules/cubasdoc";
import {GetTK,SaveHTFile} from "@/api/base";
import {debounce} from "@/utils/util";
import {checkFildsStore} from "@/stores/modules/checkFilds";
import { bool } from "vue-types";
const emit = defineEmits(['submit'])
defineOptions({ name: 'EntryBaseInfo' })
const loading=ref(false);
const props = defineProps({
  Trem: {
    type: Array,
    default: () => {
      return []
    }
  },
  ishowfile:
  {
    type:Boolean,
    default:true
  },
  Id:{
    type: String,
    default: ''
  },
  title:{
    type: String,
    default: ''
  },
  isBg:{
    type: Boolean,
    default: () => {
      return false
    }
  },
  isShowSubBut:{
    type: Boolean,
    default: () => {
      return false
    }
  }
})

let {
  Trem,
  Id,
  title,
  isBg,
  isShowSubBut
} = toRefs(props)


const singleEdit = ref(null)

// 编辑单元格监听事件
const handleEvent = (type, val, index) => {

}
// 重置表单
const reset = () => {
  singleEdit.value.resetFields()
}
const editDel = (item, index, row) => {
  //
  row.splice(index, 1)

}
// 错误校验提示
const validateError = list => {
  list.map(val => {
    setTimeout(() => {
      ElMessage.error(`${title.value}是必填项！`)
      checkFild.setData(val)
    }, 100)
  })
}

//定义数据
const state = reactive({
  loading:false,
  table: {
    border: true,
    rules: {
      TermContent: [{ required: true, message: "请选择条款", trigger: "blur" }],
      TermID: [{ required: true, message: "请选择条款", trigger: "blur" }]
    },
    // firstColumn: { type: "index", label: "序列" }, // 显示序列号
    data: [],
    columns: [
      {
        prop: "LineNum",
        label: "序号",
        width: "60",
      },{
        prop: "FileName",
        label: "文件名称",
        placeholder: "请输入文件名称",
        width: "200",
        canEdit: true,
        headerRequired: true,
        configEdit: {
          label: "文件名称",
          type: "select-arr",
          editSlotName: "FileName",
          editComponent: "el-input",
          rules: { required: true, message: "请选择条款", trigger: "blur" },
        }
      },

      {
        prop: "File1",
        label: "附件一",
        canEdit: true,
        //width: "600",
        placeholder: "请上传附件",
        configEdit: {
          label: "附件一",
          editSlotName: "uploadFile1",
          editComponent: "el-upload",
        }
      },
      {
        prop: "File2",
        label: "附件二",
        minWidth: "100",
        canEdit: true,
        placeholder: "请上传附件",
        configEdit: {
          label: "附件二",
          editSlotName: "uploadFile2",
          editComponent: "el-upload",
        }
      },
      {
        prop: "File3",
        label: "附件三",
        minWidth: "100",
        canEdit: true,
        placeholder: "请上传附件",
        configEdit: {
          label: "单位",
          editSlotName: "uploadFile3",
          editComponent: "el-upload",
        }
      },
    ],
    // 表格内操作列
    operator: [
      {
        type: "danger",
        text: "删除",
        bind:{
          disabled: isBg
        },
        fun: editDel
      }
    ],
    operatorConfig: {
      fixed: "right",
      width: "100"
    }
  },
  // 下拉选择项
  listTypeInfo: {},
})



const cubasdoc = cubasdocStore()
const checkFild = checkFildsStore()
const Main=ref(null);

//实时更新同步数据
watch(() => props.Trem, (newValue, oldValue) => {

  //console.log(props);
      state.table.data = newValue

      //Main.value=newValue?.Main;
      //console.log(Main.value);
    }, { deep: true },
)

onMounted(() => {
  state.table.data =JSON.parse(JSON.stringify(Trem.value))
  setlinenum(state.table.data);
  console.log(888);
})
// onActivated(()=>
// {
//   state.table.data =JSON.parse(JSON.stringify(Trem.value))
//   setlinenum(state.table.data);
//   console.log(Trem.value);
// })
onDeactivated(()=>
{
  state.table.data=[];
})

const setlinenum=(data)=>
{
  for(var i=0;i<data.length;i++)
   {
    var m=data[i];
     m.LineNum=i+1
    //console.log(m);
   }
}
//获取条款内容
const getTermContent = debounce(async (data) => {

  let {Data} =  await GetTK({Code: props.Id,Name:''});
  state.listTypeInfo = Data

},false,300)

//支付条件选择
function updateZfTk(e,row){
  let zftk = state.listTypeInfo.filter((its) => {
    return (its.Id.toLowerCase().includes(e.toLowerCase()))
  })[0]
  if (zftk){
    //赋值
    row.TermContent = zftk.Content
  }
}


function  addOneTable () {
  state.table.data.push({
    //获取最大行号加1
    LineNum: state.table.data.length + 1,
    TermID: null,
    TermContent: null,
    File1: null,
    File2: null,
    File3: null,
  })
}
const savefile= async ()=>
{
  loading.value=true;
  var sdata={
    Main:{
      Id:Id.value
    },
    ContractFile:[]
  };

  state.table.data.forEach(el => {
    sdata.ContractFile.push( {
      MId:Id.value,
      id:el.Id,
      File1:el.File1,
      File2:el.File2,
      File3:el.File3,
      FileName:el.FileName
    });
  });
   var mes = await SaveHTFile(sdata);
   loading.value=false;
   if(mes.status==1)
   {
     if(mes.data!=null)
     {
     state.table.data=mes.data;
    setlinenum(state.table.data);
    Trem.value=state.table.data;
     }
     else
     {
      state.table.data=[];
     }
    ElMessage.success('保存成功');


   }
   else{
    ElMessage.error(mes.message);
   }
}
let resultArr = ref([])
// 清除校验规则
const validateTable = () => {
  singleEdit.value.saveMethod(data => {

  })
}

defineExpose({validateTable})

</script>

<style scoped lang="scss">

</style>
